<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>订单管理</title>
  <script type="text/javascript">
    //根据屏幕大小及dpi调整缩放和大小
    (function () {
      var scale = 1.0;
      var ratio = 1;
      if (window.devicePixelRatio >= 2) {
        scale *= 0.5;
        ratio *= 2;
      }
      var text = '<meta name="viewport" content="initial-scale=' + scale + ', maximum-scale=' + scale +
        ', minimum-scale=' + scale + ', width=device-width, user-scalable=no" />';
      document.write(text);
      document.documentElement.style.fontSize = 50 * ratio + "px";
    })();
  </script>
  <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
  <meta http-equiv="Pragma" content="no-cache" />
  <meta http-equiv="Expires" content="0" />
  <link rel="stylesheet" href="./public/css/reset.css">
  <link rel="stylesheet" href="./public/css/common.css">
  <link rel="stylesheet" href="./public/css/order.css?v=2018">
</head>

<body>
  <div class="order-page dn" id="J_orderList">
    <section class="tab-header">
      <ul>
        <li v-bind:class="{ active: currentTab === -1 }" v-on:click="changeTabHandler(-1)">全部</li>
        <li v-bind:class="{ active: currentTab === 0 }" v-on:click="changeTabHandler(0)">体验</li>
        <li v-bind:class="{ active: currentTab === 1 }" v-on:click="changeTabHandler(1)">出售</li>
      </ul>
    </section>
    <div class="tab-content">
      <section class="tab">
        <ul class="order-list">
          <li v-for="item in list">
            <a :href="item.is_card == 1 ? 'javascript:void()' : './order-detail.html?order_no=' + item.order_no +'&is_from=list'">            
              <div class="order-item">
                <div class="hd">
                  <div class="tp">
                    <div class="status" v-if="item.status == 0">
                      订单状态: 未支付
                    </div>
                    <div class="status" v-if="item.status == 1">
                      订单状态: 已付款
                    </div>
                    <div class="status" v-if="item.status == 2">
                      订单状态: 已提货
                    </div>
                    <div class="status" v-if="item.status == 3">
                      订单状态: 使用中
                    </div>
                    <div class="status" v-if="item.status == 4 && item.order_type == 0">
                      订单状态: 已使用
                    </div>
                    <div class="status" v-if="item.status == 4 && item.order_type == 1">
                      订单状态: 已回收
                    </div>
					<div class="status" v-if="item.status == 4 && item.order_type == 2">
                      订单状态: 已使用
                    </div>
                    <div class="number">
                      订单编号: {{item.order_no}}
                    </div>
                  </div>
                  <div class="expire" v-if="item.expire_time && item.order_type != 2">
                    <!-- 有效日期: 2018-03-21 至 2018-03-21 -->
                    有效日期: {{item.expire_time}}
                  </div>
                </div>
                <div class="goods">
                  <div class="img">
					<img :src="'https://admin.buerxi.com' + item.device_pic" v-if="item.type == 2" />
                    <img :src="'https://admin.buerxi.com' + item.goods_pic" v-if="item.type == 1" />
                    <img :src="'https://admin.buerxi.com' + item.play_pic" v-if="item.type == 0" />
                  </div>
                  <div class="cont" v-if="item.type == 0">
                    {{item.play_name}}
                  </div>
				  <div class="cont" v-if="item.type == 1">
                    {{item.goods_name}}
                  </div>
				  <div class="cont" v-if="item.type == 2">
                    {{item.device_name}}
                  </div>
                  <div class="nums">*{{item.num}}</div>
                </div>
                <div class="payinfo">
                  <span class="tel">{{item.phone | hideTelNumber}}</span>
                  <div class="price">
                    <i>核销: </i>{{item.cancel_time}}
                  </div>
                </div>
              </div>
            </a>
          </li>
        </ul>
      </section>
    </div>
  </div>
  <script type="text/javascript" src="./public/js/lib/jquery-3.3.1.min.js"></script>
  <script type="text/javascript" src="./public/js/lib/vue.min.js"></script>
  <script type="text/javascript" src="./public/js/src/md5.js"></script>
  <script>
    var links = ['./public/js/src/global.js', './public/js/src/order-list.js']
    links.forEach(function (item) {
      document.write('<script type="text/javascript" src="' + item + '?ver=' + Math.random() + '"><\/script>')
    })
  </script>
</body>

</html>